// src/App.js
import React, { useEffect } from "react";
import DynamicRenderer from "./components/DynamicRenderer";

const App = () => {
  const [schema, setSchema] = React.useState();

  useEffect(() => {
    fetch("/schema.json")
      .then((res) => res.json())
      .then((data) => setSchema(data))
      .catch((error) => console.error("Error loading schema:", error));
  }, []);

  if (!schema) {
    return <div>Loading...</div>;
  }

  return (
    <div className="p-5">
      <h1 className="mb-2">动态渲染</h1>
      {schema && <DynamicRenderer schema={schema} />}
    </div>
  );
};

export default App;
